<%@ page language="java" pageEncoding="UTF-8"%>
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ page trimDirectiveWhitespaces="true" %>
<%@ taglib prefix="base" uri="http://qdbp.gitee.io/tags/base/"%>

<!DOCTYPE html>
<html>
<head>
	<%@ include file="../../_/meta.jsp"%>
	<title>更换手机号码 - ${pv.project.name}</title>
	<%@ include file="../../_/style.jsp"%>
</head>

<body>
	<header class="mui-bar mui-bar-nav">
		<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		<h1 class="mui-title">更换手机号码</h1>
	</header>
	<section class="mui-content" data-url="<base:url href='actions/account-auth/me.json'/>">
		<form name="valid" method="POST" data-vld="init:false,group:true,failFast:true,oninput:false" action="<base:url href='actions/account-auth/change-phone/create-token.json'/>" onsubmit="return false">
			<div class="mui-input-group mt-sm">
				<div class="mui-input-row">
					<label class="vld-label">原手机号码</label>
					<input name="phone" type="text" class="mui-input mui-input-clear" disabled placeholder="未设置" />
				</div>
				<div class="mui-input-row">
					<label class="vld-label">补全号码</label>
					<input name="phonePartCode" type="text" class="mui-input mui-input-clear" data-vld="[ {required:true} ]" placeholder="星号代表的几位数字是什么" />
				</div>
				<div class="mui-input-row">
					<label>登录密码</label>
					<input name="password" type="password" class="mui-input mui-input-clear" data-vld="[ {required:true} ]" placeholder="请输入登录密码" />
				</div>
			</div>
			<div class="prompt-message prompt-error"></div>
			<div class="mui-content-padded">
				<button class="mui-btn mui-btn-block mui-btn-primary do-next">下&nbsp;一&nbsp;步</button>
			</div>
		</form>
		<form class="hide" name="reset" method="POST" data-vld="init:false,group:true,failFast:true,oninput:false" action="<base:url href='actions/account-auth/change-phone/by-valid-code.json'/>" onsubmit="return false">
			<div class="mui-input-group mt-sm">
				<div class="mui-input-row">
					<label>原手机号码</label>
					<input name="phone" type="text" class="mui-input mui-input-clear" disabled placeholder="未设置" />
					<input type="hidden" name="token"/>
				</div>
				<div class="mui-input-row icon-on-left">
					<span class="icon fa fa-mobile"></span>
					<input name="account" type="text" class="mui-input mui-input-clear" placeholder="新手机号码" 
						data-vld="[ {required:true}, {regexp:'mobile'} ]" />
				</div>
				<div class="mui-input-row icon-on-left smbtn-on-right">
					<span class="icon fa fa-envelope-square"></span>
					<input name="validCode" type="text" class="mui-input mui-input-clear" placeholder="短信验证码"
						data-vld="[ {required:true} ]"  />
					<button class="smbtn send-valid-code do-send" data-countdown="{second}秒后重试" data-fields="{phone:'account',token:'token'}" data-url="<base:url href='actions/account-auth/change-phone/send-valid-code.json'/>">获取验证码</button>
				</div>
			</div>
			<div class="prompt-message prompt-error"></div>
			<div class="mui-content-padded">
				<button class="mui-btn mui-btn-block mui-btn-primary do-submit">提&nbsp;&nbsp;交</button>
			</div>
		</form>
	</section>
	
	<%@ include file="../../_/script.jsp"%>
	<script src="<base:url href='assets/libs/zhh.validate/code/zhh.validate.js'/>" type="text/javascript"></script>
	<script src="<base:url href='assets/base/core/mui/plugins-init.js'/>" type="text/javascript" data-zload-ignore="true"></script>
	<script src="<base:url href='assets/h5/auth/auth-base.js'/>" type="text/javascript"></script>
	<script src="<base:url href='assets/h5/mine/personnel/edit-phone.js'/>" type="text/javascript"></script>
	<%@ include file="../../_/analysis.jsp"%>
</body>
</html>
